// component/test2/test2.js
Component({
    options:{
        // 下划线开头的都会被定义成纯数据字段 不在页面上使用 也不是组价之间传递的数据 
        // 可以提高性能
        pureDataPattern:/^_/
    },

    // 新版定义生命周期的方法
    lifetimes:{
        created(){
            console.log('类似created方法');
        },
        attached(){
            console.log('类似Mounted方法');
        },
        detached(){
            console.log('组件离开页面节点的时候执行');
        }
    },

    // 监听当前组件所在页面的生命周期
    pageLifetimes:{
        // page页面显示
        show(){
           this._createdRandomRGB()
        },
        // page页面隐藏
        hide(){
            console.log('page hide');
        },
        resize(){
            console.log('onresize');
        }
    },

    /**
     * 组件的属性列表
     */
    properties: {

    },

    /**
     * 组件的初始数据
     */
    data: {
        rgb: {
            r: 0,
            g: 0,
            b: 0
        },
        fullColor: "0,0,0"
    },

    /**
     * 组件的方法列表
     */
    methods: {
        changeR() {
            console.log(1);
            this.setData({
                // setdata修改对象属性
                'rgb.r': this.data.rgb.r + 5 > 255 ? 255 : this.data.rgb.r + 5
            })
        },
        changeG(){
            this.setData({
                // setdata修改对象属性
                'rgb.g': this.data.rgb.g + 5 > 255 ? 255 : this.data.rgb.g + 5
            })
        },
        changeB(){
            this.setData({
                 // setdata修改对象属性
                'rgb.b':this.data.rgb.b + 5 > 255 ? 255 : this.data.rgb.b + 5,
            })
        },
        // 非事件处理函数建议_开头
        _createdRandomRGB(){
            this.setData({
                'rgb.r':Math.round(Math.random()*256) ,
                'rgb.g':Math.round(Math.random()*256) ,
                'rgb.b':Math.round(Math.random()*256) 
            })
            console.log(this.data.rgb);
        }
    },
    observers:{
        // 监听对象属性变化
        'rgb.r,rgb.g,rgb.b':function(r,g,b){
            this.setData({
                fullColor:`${r},${g},${b}`
            })
        },
        // 监听对象所有属性
        'rgb.**':function(obj){
           console.log('改变后的对象值是',obj);
        }
    }
})